<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>采购入库</title>
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="renderer" content="webkit">
<link rel="stylesheet" href="${ctx}/static/layui/css/layui.css">
<style type="text/css">
li {
	margin-top: 8px;
}
</style>
</head>
<body>
	<div style="border: 1px solid #9D9D9D; height: 50px;">
		<button class="layui-btn" onclick="openButton(0)">新建票据</button>
		<button class="layui-btn" onclick="openButton(1)">新增商品</button>
	</div>
	<div class="layui-row">
		<div class="layui-col-sm6">
			<div style="height: 590px; border: 1px solid #9D9D9D;">
				<ul class="flow-default" id="demo1"
					style="height: 540px; overflow-y: scroll;">
				</ul>
				<div style="border-top: 1px solid #9D9D9D; height: 50px;">
					<button class="layui-btn" id="deleteLi">删除</button>
				</div>
			</div>
		</div>
		<div class="layui-col-sm6">
			<div style="height: 590px; border: 1px solid #9D9D9D;">
				<ul class="flow-default" id="demo2"
					style="height: 590px; overflow-y: scroll;">
				</ul>
			</div>
		</div>
	</div>
	<script src="${ctx}/static/layui/layui.js"></script>
	<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
	<script>
		layui.use('flow',function() {
							var $ = layui.jquery; //不用额外加载jQuery，flow模块本身是有依赖jQuery的，直接用即可。
							var flow = layui.flow;

							flow.load({	elem : '#demo1', //指定列表容器
										scrollElem : '#demo1',
										done : function(page, next) { //到达临界点（默认滚动触发），触发下一页
											var lis = [];
											//以jQuery的Ajax请求为例，请求下一页数据（注意：page是从2开始返回）
											//ostate : 0草稿,1已审核;otype:1入库;0出库
											$.post('${ctx}/order/list',
													{
														ostate : "0",
														otype : "1",
														page : page
													},
													function(res) {
														//假设你的列表返回在data集合中
														var lis = [];
														layui.each(res.data,function(index,item) {
																			lis.push('<a onclick="openclick(\''+item.oid+'\','+item.ostate+','+item.otype+');" ondblclick="openIframe(\'采购入库单\',\''+item.oid+'\',\'${ctx}/test/ysh?oid='+item.oid+'&ostate='+item.ostate+'&otype='+item.otype+'\');"><li style="width: 40%;height:100px;float: left;margin-right: 5px;"><img src="${ctx}/static/img/cg.png" style="float: left;" />'
																							+ '<ul><li>'
																							+ item.osname
																							+ '</li><li>票号:'
																							+ item.obill
																							+ '</li><li>品种: 1 ;&nbsp;&nbsp;&nbsp;&nbsp; ¥:'+item.money
																							+ '</li></ul></li></a>');
																		});
														//执行下一页渲染，第二参数为：满足“加载更多”的条件，即后面仍有分页
														//pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多
														next(lis.join(''),page < (res.count / 4));
													});
										}
									});

							flow.load({
										elem : '#demo2',//流加载容器
										scrollElem : '#demo2', //滚动条所在元素，一般不用填，此处只是演示需要。
										done : function(page, next) { //执行下一页的回调
											//ostate : 0草稿,1已审核;otype:1入库;0出库
											$.post('${ctx}/order/list',
															{
																ostate : "1",
																otype : "1",
																page : page
															},
															function(res) {
																//假设你的列表返回在data集合中
																var lis = [];
																layui.each(res.data,function(index,item) {
																	lis.push('<a ondblclick="openIframe(\'采购入库单\',\''+item.oid+'\',\'${ctx}/test/ysh?oid='+item.oid+'&ostate='+item.ostate+'&otype='+item.otype+'\');"><li style="width: 40%;height:100px;float: left;margin-right: 5px;"><img src="${ctx}/static/img/ysh.png" style="float: left;" />'
																									+ '<ul><li>'
																									+ item.osname
																									+ '</li><li>票号:'
																									+ item.obill
																									+ '</li><li>品种: 1 ;&nbsp;&nbsp;&nbsp;&nbsp; ¥:'+item.money
																									+ '</li></ul></li>');
																				});
																//执行下一页渲染，第二参数为：满足“加载更多”的条件，即后面仍有分页
																//pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多
																next(lis.join(''),page < (res.count / 4));
															});
											//执行下一页渲染，第二参数为：满足“加载更多”的条件，即后面仍有分页
											//pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多
										}
									});
	});
	</script>
	<script src="http://code.jquery.com/jquery-latest.js"></script>
	<script>
	function openIframe(title,id,url)
	{
 		layui.use('layer', function(){
 			  var layer = layui.layer;
		layer.open({
				type : 2,
				title : title,
				area:  ['1000px', '800px'],
				maxmin : true, //开启最大化最小化按钮
				content : url,
				id : id,
				end: function(){
					window.location.reload();
				  }
			});
		});
	};
	
	function openclick(id,ostate,otype)
	{
		sessionStorage.setItem('deleteliID', id);
		sessionStorage.setItem('deleteliOstate', ostate);
		sessionStorage.setItem('deleteliOtype', otype);
	};
	
	 $("#deleteLi").on('click',function (){
		 var deleteliID = sessionStorage.getItem('deleteliID');
		 var deleteliOstate = sessionStorage.getItem('deleteliOstate');
		 var deleteliOtype = sessionStorage.getItem('deleteliOtype');
			layui.use('layer', function(){
			  var layer = layui.layer;
			  layer.confirm('确认删除该草稿?', function(index) {
					 $.ajax({
						url : '${ctx}/order/deleteliID',
						type : "post",
						data : {
							oid : deleteliID,
							ostate : deleteliOstate,
							otype : deleteliOtype
						},
						success : function(data) {
							if (data == 'ok') {
								layer.open({
									content : '删除成功!',
									time : 3000,
									icon : 1
								});
							} else {
								layer.open({
									content : '删除失败!',
									time : 3000,
									icon : 5
								});
							}
							window.location.reload();
						},
						error : function() {
							layer.open({
								content : '未知错误!',
								time : 3000,
								icon : 5
							});
							window.location.reload();
						}
					}) 
					layer.close(index);
				});				
		});
	}); 
	 
	 function openButton(isOk)
		{
		 var isOK = isOk;
		 if(isOK == '0')
			 {
			 //新建票据
			 layui.use('layer', function(){
	 			 	var layer = layui.layer;
					layer.open({
						type : 2,
						title : '新建票据',
						area:  ['1000px', '800px'],
						maxmin : true, //开启最大化最小化按钮
						content : '${ctx}/test?oid=\''+null+'\');',
						end: function(){
							window.location.reload();
						  }
						});
				});
			 }
		 else {
			 //新增商品
			 layui.use('layer', function(){
	 			 	var layer = layui.layer;
					layer.open({
						type : 2,
						title : '新增商品',
						area:  ['1000px', '800px'],
						maxmin : true, //开启最大化最小化按钮
						content : '${ctx}/shop',
						end: function(){
							window.location.reload();
						  }
						});
				});
		}
		};
	
	</script>
</body>
</html>